import { Tree } from "antd";
import { useComponentsStore } from "../../../stores/components";

export const Outline = () => {

    const { components, setCurComponentId } = useComponentsStore();

    return (
        <Tree
            fieldNames={{ title: 'desc', key: 'id' }}
            treeData={components as any}
            defaultExpandAll
            onSelect={([selectedKey])=>{
                // 解构赋值取选中数组的第一个元素
                setCurComponentId(selectedKey as number);
            }}
            showLine />
    )
}